<!--  -->
<template>
  <div class="category">
    <NavBar class="cate_navbar">
      <div slot="center">商品分类</div>
    </NavBar>
    <Search class="cate_searh">
      <div slot="center">
        <input type="text" placeholder="搜索" />
      </div>
    </Search>

    <Cates></Cates>



  </div>
</template>

<script>
import NavBar from "@/components/common/navBar/NavBar.vue";
import Search from "@/components/common/search/Search.vue";
import Cates from './cates/Cates.vue'

export default {
  name: "Category",
  components: {
    NavBar,
    Search,
    Cates
  },
};
</script>

<style scoped lang='less'>
.cate_navbar {
  background-color: #eb4450;
  color: #fff;
  font-weight: 600;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9;
}
.cate_searh {
  margin-top: 44px;
  background-color: #eb4450;
  input {
    text-align: center;
    width: 95%;
    height: 30px;
    border: none;
    background-color: #fff;
    border-radius: 10px;
  }
}
</style>